<template>
	<view>
		<uni-list v-if="list && list.length>0">
			<uni-list-item 
				v-for="(item,index) in list" 
				:title="item.title" 
				:note="item.hot" 
				:thumb="item.picUrl?item.picUrl:'/static/image/xinwen.jpg'" 
				thumb-size="lg" 
				showArrow/>
		</uni-list>
		<uni-load-more :status="status"></uni-load-more>
	</view>
</template>
<script setup>
	import { ref } from 'vue';
	//导入下拉刷新的监听方法,监听上拉加载
	import { onPullDownRefresh,onReachBottom } from '@dcloudio/uni-app';

	const pageNum=ref(1);//定义请求当前页码
	const pageSize=ref(10);//默认每页显示10条数据
	const list=ref(null);//定义请求返回的数据列表
	const status=ref('no-more');//定义默认上拉加载的状态
	
	function getData(){//定义获取数据的方法
		uni.request({
			url: 'https://whyta.cn/api/tx/generalnews',
			//url:'https://api.vvhan.com/api/hotlist/36Ke',
			method: 'GET',
			data: {key:'36de5db81215',page:pageNum.value,num:pageSize.value},
			success: res => {
				console.log(res.data);
				if(pageNum.value<=1){//当前页是1的数据(默认进入页面和下拉刷新时是1)
					list.value=res.data.result.newslist;
					//list.value=res.data.data;
				}else{//下一页的数据追加到原来的列表最后
					list.value=[...list.value,...res.data.result.newslist]
					//list.value=[...list.value,...res.data.data];
				}
				status.value='more';//设置上拉加载的状态为可以有下一页
			},
			complete: () => {
				uni.stopPullDownRefresh();//关闭下拉刷新状态
				uni.showToast({icon:'none',title:'数据获取成功'});
			}
		});
	}
	
	//执行下拉刷新的动作
	onPullDownRefresh(()=>{
		pageNum.value=1;//下拉刷新，当前设置为1
		getData();
	})
	
	//执行上拉加载的动作
	onReachBottom(()=>{
		//设置请求的下一页为当前页+1
		pageNum.value++;//pageNum.value=pageNum.value+1;
		if (status.value != 'more') return;
		status.value = 'loading';
		getData();
	})
		
	getData();
</script>

<style>
	       
</style>
